<template>
	<view>
		<view class="midPart" v-for="comment in commentList">
			<view class="comment" @click="jumpCommentDetail">
				<!-- <view class="top">
					<view class="text"></view>
					<view class="icon">
						<uni-icons type="right" size="30"></uni-icons>
					</view>
				</view> -->
				<view class="bottom">
					<view class="img">
						<image class="userImg" :src="comment.imgSrc" mode=""></image>
					</view>
					<view class="nickName">{{comment.nickName}}</view>
					<view class="createTime">{{comment.createTime}}</view>
					<view class="content">{{comment.content}}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		onLoad(e) {
			console.log(e);
			this.itemId = e.itemId;
			this.selGoodComment();
		},
		data() {
			return {
				itemId: "",
				commentList: []
			};
		},
		methods: {
			selGoodComment() {
				let jwt = uni.getStorageSync('authority');
				uni.request({
					url: "api/appuser/selGoodComment",
					header: {
						"authority": jwt
					},
					method: 'GET',
					data: {
						itemId: this.itemId
					},
					success: (res) => {
						console.log(res);
						if (res.data.code == 200) {
							this.commentList = res.data.data;
						}
						if (this.commentList.length == 0) {
							this.commentList[0] = {};
							this.commentList[0].content = "暂无用户评价";
						}
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #f4f4f6;
	}

	.midPart {
		width: 700rpx;
		height: 300rpx;
		background-color: #fff;
		border-radius: 30rpx;
		margin: 0 auto;
		margin-top: 50rpx;
		margin-bottom: 30rpx;

		.comment {
			.top {
				// background-color: #ff4b37;
				height: 100rpx;
				border-bottom: 1px solid gray;
				line-height: 100rpx;

				.text {
					float: left;
					font-size: 30rpx;
					margin-left: 20rpx;
				}

				.icon {
					float: right;
					margin-right: 10rpx;
				}
			}

			.bottom {
				.img {
					float: left;
					margin-top: 5rpx;
					margin-left: 5rpx;

					.userImg {
						width: 100rpx;
						height: 100rpx;
						border-radius: 50rpx;
					}
				}

				.nickName {
					float: left;
					width: 280rpx;
					height: 70rpx;
					line-height: 90rpx;
					margin-left: 10rpx;
					// background-color: gray;
				}

				.createTime {
					float: left;
					width: 300rpx;
					height: 70rpx;
					line-height: 70rpx;
					font-size: 25rpx;
				}

				.content {
					float: left;
					// background-color: gray;
					margin-top: 10rpx;
				}
			}
		}
	}
</style>